import { WeaLeftTree } from 'ecCom';
import * as mobx from 'mobx';
import { observer } from 'mobx-react';
import { toJS } from 'mobx';

@observer
class ListLeftTree extends React.Component{

    render(){
        const {leftTree,leftTreeCount,leftTreeCountType,selectedTreeKey} = this.props.listStore;
        const {setShowSearchAd,clearFormFields,doSearch,setSelectedTreeKey,form} = this.props.listStore;
        return (
            <WeaLeftTree ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftTree@uxlz35`}
                datas={toJS(leftTree)}
                counts={toJS(leftTreeCount)}
                countsType={toJS(leftTreeCountType)}
                selectedKeys={[selectedTreeKey]}
                onSearchLabelClick ={()=>{
                    setShowSearchAd(false);
                    clearFormFields();
                    setSelectedTreeKey("");
                    doSearch({capitalgroupid:""},"tree","");
                }}
                onSelect={(key,topTabCount,countsType)=>{
                    const {node:{props:{data}}} = countsType;
                    setShowSearchAd(false);
                    clearFormFields();
                    setSelectedTreeKey(key);
                    doSearch({
                        capitalgroupid: topTabCount.keyid
                    },"tree",countsType.selectedNodes[0].props.name);
                    form.updateFields({'capitalgroupid':{'value':data.key,valueObj:[{'name':data.name,'id':data.key}],valueSpan:data.name}});
                }} 
            />
        );
    }
}

export default ListLeftTree;